import React from 'react'
import { connect } from 'react-redux'
import {Tabs, Modal, Popover, Tag, Radio, Affix, Button, Row, Col, Checkbox, message, Input} from 'antd'
const TabPane = Tabs.TabPane;
import { dealListTag, deepFullCopy, messages, queryCurrencyPrecision } from "share/common";
import { wrappedRowSelection } from 'components/table/table-row-selection'
const Search = Input.Search;
import debounce from "lodash.debounce";
import openSlideFrame from "share/openSlideFrame";
import AdvancedTable from "components/advanced-table";
import approveService from "./approve.service";
import errorMessage from "share/errorMessage";
import constants from "share/constants";
import NumberRange from "../financial-management/expense-view/component/number-range";
import moment from 'moment'
import ApproveBar from "components/template/approve-bar";
import checkingImg from "images/checking.png";
import loadingImg from "images/loading.png";
import menuRoute from "routes/menuRoute";
import Condition from 'components/condition'
const { If } = Condition;
import CheckboxGroupALL from './component/checkbox-group-all'
import selectorData from "share/selectorData";
import resizeTableService from 'components/resize-table/resize-table.service'
import Space from "components/space";
import Department from "components/template/department"
class ApproveList extends React.Component {
  constructor(props) {
    super(props);
    this.entityTypeList = {
      1111: messages('common.all')/*全部*/,
      1001: messages('request-4.key1')/*申请单*/,
      1002: messages('request-4.key2')/*报销单*/,
      3001: messages('request-4.key3')/*借款单*/,
      4001: messages('request-4.key4')/*其他*/,
      6001: messages('request-4.key5')/*合同*/,
      7001: messages('request-4.key6')/*付款申请单*/
    };
    this.state = {
      status: 'approving',
      loading: true,
      entityType: 1111, //单据类型
      formTypeList: [],
      pagination: {
        total: 0,
        page: 0,
        pageSize: 20,
      },
      data: [],
      selectedRows: [],
      selectedRowKeys: [],
      visible: false,
      animationName: 'hide',
      searchForm: [
        {
          id: 'entityType',
          component: (
            <Radio.Group onChange={this.onChangeEntityType}>
              <Radio key={1111} value={1111}>{messages('common.all')/*全部*/}</Radio>
              {this.getEntityType(1111).map(value => <Radio key={value} value={value}>{this.entityTypeList[value]}</Radio>)}
            </Radio.Group>),
          label: messages('request-4.key7')/*单据类型*/,
          initialValue: Number(props.params.entityType) || 1111,
          row: true,
          dataIndex: 'entityType',
          tagParser: value => this.entityTypeList[value]
        }, {
          id: 'businessCode', label: messages('common.document.code')/*单号*/, component: 'Input'
        }, {
          component: 'Selector',
          id: 'applicantOIDs',
          label: messages('common.applicant')/*申请人*/,
          props: {
            placeholder: messages('common.please.input')/*请输入*/ + messages('request-4.key8')/*申请人姓名/工号*/,
            type: 'user',
            selectorItem: {
              ...selectorData['user'],
              url: `/api/users/v3/search?status=all`,
              label: record => (`${record.employeeID}-${record.fullName}${(record.status !== 1001 ?
                  (`（${record.status === 1002 ?
                      messages('request-4.key9')/*待离职员工*/ :
                      messages('request-4.key10')/*离职员工*/}）`
                  ) :
                  ''
              )}`)
            }
          },
        }, {
          id: 'departmentOIDs',
          label: messages('common.department')/*部门*/,
          parser: value => ({
            departmentOIDs: value ? value.map(item => item.departmentOID) : null
          }),
          tagParser: value => (value.map(item => item.title).join(',')),
          component: <Department showCompany />
        }, {
          id: 'priceRange',
          label: messages('request-4.key11')/*金额范围*/,
          component: <NumberRange/>,
          parser: value => ({
            minAmount: value && value[0] ? value[0] : null,
            maxAmount: value && value[1] ? value[1] : null
          }),
          tagParser: value => value && (value[0] || value[1]) && `${value[0] === 0 ? value[0] : value[0] || ''} ~ ${value[1] === 0 ? value[1] : value[1] || ''}`
        }, {
          id: 'dateRange', label: messages('common.submit.date')/*提交日期*/,
          component: 'DateRangePicker',
          parser: value => ({
            beginDate: value && value[0] ? moment(value[0]).format('YYYY-MM-DD') : null,
            endDate: value && value[1] ? moment(value[1]).format('YYYY-MM-DD') : null
          })
        }, {
          component: 'Chooser',
          id: 'companyOIDs',
          label: messages('request-4.key12')/*公司*/,
          props: {
            labelKey: 'name',
            valueKey: 'companyOID',
            type: 'permission_company',
            listExtraParams:{enabled: true}
          },
          parser: value => ({
            companyOIDs: value ? value.map(item => item.companyOID) : null
          }),
          JSONObjectFormatterParams: ['departmentName', 'companyOID']
        }],
      columns: [
        {
          title: messages('common.sequence')/*序号*/, dataIndex: 'index', width: 80,
          render: (value, record, index) =>
            (index + 1 + this.state.pagination.pageSize * this.state.pagination.page) +
            (record.approverOID && record.currentUserOID && record.approverOID !== record.currentUserOID ?
              `(${messages('common.proxy')/*代理*/})` : '')
        }, {
          title: messages('common.user.id')/*工号*/, dataIndex: 'employeeID', width: 80, render: value =>
            value ? <Popover placement="topLeft" content={value}>{value}</Popover> : '-'
        }, {
          title: messages('common.applicant')/*申请人*/, dataIndex: 'applicant', width: 100, render: value =>
            (value && value.fullName) ?
              <Popover placement="topLeft" content={value.fullName}>{value.fullName}</Popover> : '-'
        }, {
          title: messages('common.submit.date')/*提交日期*/,
          dataIndex: 'submittedDate',
          sorter: true,
          width: 120,
          render: (value, record) => {
            let result = value ? moment(value).format('YYYY-MM-DD') : moment(record.lastSubmittedDate).format('YYYY-MM-DD');
            return result;
          }
        }, {
          title: messages('common.document.name')/*单据名称*/, dataIndex: 'formName', width: 120, render: value =>
            value ? <Popover placement="topLeft" content={value}>{value}</Popover> : '-'
        }, {
          title: messages('request-4.key652')/*单据公司*/, dataIndex: 'companyName', width: 120, render: value =>
            value ? <Popover placement="topLeft" content={value}>{value}</Popover> : '-'
        }, {
          title: messages('request-4.key653')/*单据公司编码*/, dataIndex: 'companyCode', width: 140, render: value =>
            value ? <Popover placement="topLeft" content={value}>{value}</Popover> : '-'
        }, {
          title: messages('common.document.code')/*单号*/, dataIndex: 'businessCode', sorter: true, width: 120, render: value =>
            value ? <Popover placement="topLeft" content={value}>{value}</Popover> : '-'
        }, {
          title: messages('request-4.key13')/*事由*/, width: 150, dataIndex: 'title', render: value =>
            value ? <Popover placement="topLeft" content={value}>{value}</Popover> : '-'
        }, {
          title: messages('common.currency')/*币种*/, dataIndex: 'currencyCode', width: 80,
          render: (value, record) => {
            return record.showAmount ? value : '-'
          }
        }, {
          title: messages('common.amount')/*金额*/,
          dataIndex: 'amount',
          sorter: true,
          width: '8%',
          align: 'right',
          render: (value, record) => {
            return record.showAmount ? this.filterMoney(value, queryCurrencyPrecision(record.currencyCode)) : '-'
          }
        }, {
          title: messages('request-4.key14')/*本币金额*/, dataIndex: 'baseCurrencyAmount', width: '8%', align: 'right', sorter: true,
          render: (value, record) => {
            return record.showAmount ? this.filterMoney(value, queryCurrencyPrecision(record.baseCurrencyCode)) : '-'
          }
        }
      ],
      contractDetail: menuRoute.getRouteItem('approve-contract-detail', 'key'), //合同详情
      tableName: 'approve-list-approving'
    };
    this.approveRequestQuickView = menuRoute.getRouteItem('approve-request-quick-view', 'key'); //快速查看申请单页
    this.handleSearch = debounce(this.handleSearch, 500);
  }

  componentDidMount() {
    const { profile, newProfile } = this.props;
    this.setState({
      status: this.props.location.query.tab === 'approved' ? 'approved' : 'approving',
      batchEnabled: newProfile['approvalFunctionOpt']['batchApprovalEnabled'],
      allEnabled: profile['approve.checkall.enable'],
      loading: true
    }, () => {
      this.processSearchForm();
      this.processColumns();
      this.getForm();
      this.setState({ loading: false })
    })
  }

  handleSearch = businessCode => {
    this.setState({ businessCode }, () => {
      this.advancedTableRef.getList(true, 1);
    })
  };

  service = (page, pageSize, searchParams) => {
    const { sort, status, businessCode } = this.state;
    let params = {
      ...searchParams,
      sort,
      finished: status === 'approved',
      businessCode: businessCode || searchParams.businessCode,
      page,
      size: pageSize,
      entityType: searchParams.entityType === 1111 ? '' : searchParams.entityType
    };
    let nodeOIDList = [];
    return approveService.getApproveList(approveService.processSearchParams(params)).then(res => {
      res.data.map(item => {
        item.addSign && (item.nodeName = messages('request-4.key15')/*自选审批*/);
        status === 'approving' && item.nodeOID && (nodeOIDList.push(item.nodeOID))
      });
      return res;
    }).then(res => {
      return approveService.getApproveNodeName(nodeOIDList).then(resq => {
        res.data.map(oneData => {
          if (oneData.nodeOID) {
            resq.data.map(node => {
              if (oneData.nodeOID === node.ruleApprovalNodeOID) {
                oneData.nodeName = `${node.name}${oneData.nodeAddSign ? messages('request-4.key16')/*(加签)*/ : ''}`;
              }
            });
          }
        });
        return res
      });
    })
  };

  onChangePage = (data, pagination, searchParams) => {
    delete searchParams.businessCode;
    this.setState({
      data,
      pagination,
      entityType: searchParams.entityType,
      searchParams,
      businessCode: ''
    });
  };

  getForm = () => {
    const { status } = this.state;
    approveService.getDocumentTypev2({finished: status === 'approved'}).then(res => {
      this.setState({ formTypeList: res.data}, this.getFormOIDs)
    });
  };

  getFormOIDs = () => {
    const { formTypeList, searchForm, entityType } = this.state;
    let options = [];
    let formType = [];
    let valueMap = {};
    formType = formTypeList[entityType];
    formType && Object.keys(formType).map(key => {
      valueMap[formType[key].join(',')] = key;
      options.push({label: key, value: formType[key].join(',')});
    });
    let formTypeSearchForm = {
      id: 'formOIDs',
      component: <CheckboxGroupALL options={options} entityType={entityType}/>,
      label: messages('common.document.name')/*单据名称*/,
      initialValue: [],
      dataIndex: 'formOIDs',
      row: true,
      parser: value => value.filter(i => i === '_ALL').length ? '' : {'formOIDs': value},
      tagParser: value => value.filter(i => i === '_ALL').length ? messages('common.all')/*全部*/ : value.map(i => valueMap[i]).join(',')
    };
    if(entityType !== 1111 && options.length) {
      !searchForm.filter(i => i.id === 'formOIDs').length ?
        searchForm.splice(1, 0, formTypeSearchForm) :
        (searchForm[1] = formTypeSearchForm)
    } else {
      searchForm[1].id === 'formOIDs' && searchForm.splice(1, 1);
    }
    this.setState({ searchForm });
  };

  onChangeEntityType = e => {
    this.setState({ entityType: e.target.value }, this.getFormOIDs);
  };

  getEntityType = value => {
    const { profile } = this.props;
    const { entityType } = this.props.params;
    let result = (value === 1111 || entityType === ':entityType') ? [] : [entityType];
    if (!result.length) {
      result = [3001, 4001, 6001, 7001];
      if (!profile['er.opt.approval.disabled']) {
        result.push(1002);
      }
      if (!profile['ca.opt.approval.web.disabled']) {
        result.push(1001);
      }
    }
    return result;
  };

  //已审批页面 搜索条件中要去除节点, 待审批页面，搜索条件增加节点搜索
  processSearchForm = () => {
    const { status, searchForm } = this.state;
    let searchFormTemp = deepFullCopy(searchForm);
    let hasNode = searchForm.filter(i => i.id === 'nodeOIDs').length;
    if (status === 'approving' && !hasNode) {
      searchFormTemp.push({
        id: 'nodeOIDs',
        component: 'Searcher',
        label: messages('request-4.key17')/*节点*/,
        dataIndex: 'nodeOIDs',
        props: {
          type: 'nodeType',
          labelKey: 'name',
          valueKey: 'key'
        }
      });
    }
    if (status === 'approved' && hasNode) {
      searchFormTemp.pop();
    }

    this.setState({ searchForm: searchFormTemp });
    return searchFormTemp;
  };

  processColumns = () => {
    const { status, columns } = this.state;
    let hasNodeName = columns.filter(i => i.dataIndex === 'nodeName').length;
    let hasStatusTag = columns.filter(i => i.dataIndex === 'status').length;
    if( status === "approving") {
      !hasNodeName && columns.splice(5, 0, {
        title: messages('request-4.key18')/*节点名称*/,
        dataIndex: 'nodeName',
        width: 120,
        render: value => value ? <Popover placement="topLeft" content={value}>{value}</Popover> : '-'
      });
      hasStatusTag && columns.pop();
      this.setState({ columns, tableName: 'approve-list-approving' }, () => this.advancedTableRef.clearCache());
    } else { //status === "approved"
      hasNodeName && columns.splice(5, 1);
      !hasStatusTag && columns.push({
        title: messages('common.column.status')/*状态*/,
        dataIndex: 'status',
        width: 160,
        hide: true, //默认不展示状态列，需自行设置
        render: (value, record) => {
          return value ? (
              <Tag color={this.getTextByValue(value, record, 'color')}>{this.getTextByValue(value, record, 'text')}</Tag>
            ) : (<span>--</span>)
        }
      });
      this.setState({ columns, tableName: 'approve-list-approved' }, () => this.advancedTableRef.clearCache());
    }
    //this.setState({ columns }, () => this.advancedTableRef.onChangeColumns(columns));
  };

  getTextByValue = (value, record, attr) => {
    return constants.getTextByValue(
      (record.rejectType !== 1000 ? value + '' + record.rejectType : (record.applicationType ? value + '' + record.applicationType : value) ) + '',
      'documentStatus',
      attr
    )
  };

  showErrorMessage = err => errorMessage(err.response);

  onChangeTab = key => {
    this.setState({ status: key }, () => {
      Promise.all([
        this.getForm(),
        this.processSearchForm(),
        this.processColumns()
      ]).then(() =>this.advancedTableRef.getList(true, 1));
    })
  };

  onChangeTable = (pagination, filters, sorter) => {
    const { sort } = this.state;
    let nextSort = '';
    if(sorter.order) {
      nextSort = `${sorter.columnKey},${sorter.order === 'ascend' ? 'ASC' : 'DESC'}`
    }
    if(nextSort !== sort) {
      this.setState({ sort: nextSort }, this.advancedTableRef.getList);
    }
  };

  /**
   * 改为侧拉以后就可以删掉那个烦人的cacheSearchData了
   * @param record
   */
  handleRowClick = record => {
    const { status } = this.state;
    switch (record.entityType) {
      case 1001://申请单
        openSlideFrame.openRequestReport({
          formOID: record.formOID,
          applicationOID: record.entityOID,
          status: status,
          approverOID: record.approverOID,
          entry: 'approve'
        }, {
          afterClose: value => {
            typeof value === 'boolean' && value && this.advancedTableRef.getList(true);
          }
        }, this);
        break;
      case 1002://报销单
        //对公支付单
        if(record.formType === 3004) {
          openSlideFrame.openCorporateReportDetail({
            expenseReportOID: record.entityOID,
            approverOID: record.approverOID,
            tab: status,
            entry: 'approve'
          }, {
            noPadding: true,
            afterClose: value => {
              typeof value === 'boolean' && value && this.advancedTableRef.getList(true);
            },
          }, this);
          return;
        }
        openSlideFrame.openExpenseReport({
          expenseReportOID: record.entityOID,
          approverOID: record.approverOID,
          status: status,
          entry: 'approve'
        }, {
          afterClose: value => {
            typeof value === 'boolean' && value && this.advancedTableRef.getList(true);
          },
        }, this);
        break;
      case 3001://借款单
        openSlideFrame.openLoanReport({
          formOID: record.formOID,
          loanBillOID: record.entityOID,
          status: status,
          approverOID: record.approverOID,
          pathname: this.props.location.pathname,
          entry: 'approve'
        }, {
          afterClose: value => {
            typeof value === 'boolean' && value && this.advancedTableRef.getList(true);
          },
        }, this);
        break;
      case 4001://其他
        console.log(status);
        openSlideFrame.openOtherReport({
          formOID: record.formOID,
          entityOID: record.entityOID,
          status: status,
          approverOID: record.approverOID,
          entry: 'approve'
        }, {
          afterClose: value => {
            typeof value === 'boolean' && value && this.advancedTableRef.getList(true);
          },
        }, this);
        break;
      case 6001:
        openSlideFrame.contractDetail({
          formOID: record.formOID,
          entityOID: record.entityOID,
          status: status,
          id:record.entityOID,
          approverOID: record.approverOID,
          entry: 'approve'
        }, {
          afterClose: value => {
            typeof value === 'boolean' && value && this.advancedTableRef.getList(true);
          },
        }, this);
        break;
      case 7001:
        openSlideFrame.openPaymentDetail({
          formOID: record.formOID,
          paymentRequestOID: record.entityOID,
          status: status,
          id:record.entityOID,
          approverOID: record.approverOID,
          entry: 'approve'
        }, {
          afterClose: value => {
            typeof value === 'boolean' && value && this.advancedTableRef.getList(true);
          },
        }, this);
        break;
    }
  };

  onSelectChange = ( selectedRowKeys, selectedRows ) => {
    this.setState({ selectedRowKeys, selectedRows }, () => {
      if(selectedRowKeys.length) {
        this.setState({ animationName: "slideUp" })
      } else {
        this.setState({ animationName: "slideDown" }, () => {
          setTimeout(() => {
            this.setState({ animationName: "slideDown hide" })
          }, 501)
        })
      }
    });
  };

  handleChangeIsAll = (value) => {
    const { data } = this.state;
    let selectedRowKeys = value ? data.map(record => record.entityOID + record.approverOID) : [];
    let selectedRows = value ? deepFullCopy(data) : [];
    this.setState({
      isAll: value
    }, () => this.onSelectChange(selectedRowKeys, selectedRows));
  };

  handleQuickView = () => {
    let url = this.approveRequestQuickView.url;
    this.context.router.push(url)
  };

  //审批操作
  handleApprove = (value, type) => {
    const { isAll, selectedRows } = this.state;
    let params = {
      entities: selectedRows,
      approvalTxt: value.reason
    };

    if (isAll) {
      this.handleApproveAll(value.reason, type);
      return;
    }
    this.setState({[type === 'pass' ? 'passLoading' : 'rejectLoading']: true});
    approveService[type === 'pass' ? 'handleRequestApprovePass' : 'handleRequestApproveReject'](params).then(res => {
      if (res.status === 200) {
        message.success(messages('request-4.key19',{arg1: res.data.successNum})/*成功处理 {arg1} 笔单据*/ + ', ' +
          messages('request-4.key20',{arg1: res.data.failNum})/*失败 {arg1} 笔单据*/);
        this.setState({passLoading: false, rejectLoading: false});
        this.setState({
          status: 'approving'
        }, () => {
          this.getForm();
          this.advancedTableRef.getList(true);
          this.onSelectChange([], []);
        })
      }
    }).catch(e => {
      this.setState({passLoading: false, rejectLoading: false});
      message.error(`${messages('common.operate.filed')/*操作失败*/}，${e.response.data.message}`)
    })
  };

  //全量审批
  handleApproveAll = (value, type) => {
    const { approvePendingSearchParams, entityType } = this.state;
    let resultEntityType = entityType;
    let body = {
      "approvalTxt": value,
      "operationType": type === 'pass' ? 1001 : 1002
    };
    this.setState({[type === 'pass' ? 'passLoading' : 'rejectLoading']: true});
    approveService.handleAllApprove(resultEntityType, approvePendingSearchParams, body).then(res => {
      this.setState({passLoading: false, rejectLoading: false, visible: true});
      this.getForm();
      this.advancedTableRef.getList(true);
      this.onSelectChange([], []);
    }).catch(e => {
      this.setState({passLoading: false, rejectLoading: false});
      message.error(`${messages('common.operate.filed')/*操作失败*/}，${e.response.data.message}`)
    });
  };

  //关闭全量审批的提示弹框
  handleClose = () => this.setState({ visible: false });

  render() {
    const { loading, status, selectedRows, searchForm, columns, batchEnabled, allEnabled, isAll,
      passLoading, rejectLoading, visible, animationName, selectedRowKeys, tableName
    } = this.state;
    let rowSelection = Object.assign({},
      wrappedRowSelection({
        limit: 20,
        rowKey: record => record.entityOID + record.approverOID,
        parser: record => ({
          approverOID: record.approverOID,
          entityOID: record.entityOID,
          entityType: record.entityType
        }),
        selectedRows,
        selectedRowKeys
      }, this.onSelectChange), {
      getCheckboxProps: record => ({
        disabled: isAll
      })
    });
    return (
      <div className="approve-request full-height-page full-page-margin" style={{height: 'calc(100vh - 110px)'}}>
        <Tabs onChange={this.onChangeTab}>
          <TabPane tab={messages('request-4.key21')/*待审批*/} key="approving"/>
          <TabPane tab={messages('request-4.key22')/*已审批*/} key="approved"/>
        </Tabs>
        {/*每次需要获取代码最新的columns需要设置新的tableName，不然会被已存在配置覆盖，已使用过的tableName有：approve-list、approve-list-new、approve-list-new-style*/}
        <AdvancedTable
          loading={loading}
          waterMark
          tableName={tableName}
          title={status === 'approving' ? messages('request-4.key21')/*待审批*/ : messages('request-4.key22')/*已审批*/}
          searchForm={searchForm}
          columns={columns}
          service={this.service}
          onGetData={this.onChangePage}
          onGetDataError={this.showErrorMessage}
          onChange={this.onChangeTable}
          onRef={ref => this.advancedTableRef = ref}
          expandedRowRender={dealListTag}
          rowKey={record => record.entityOID + record.approverOID}
          onRow={record => ({
            onClick: () => this.handleRowClick(record)
          })}
          expandAll
          rowSelection={status === 'approving' && batchEnabled ? rowSelection : null}
        >
          <div className="table-header">
            <div className="table-header-buttons" style={{height: 32}}>
              <Space>
                {status === 'approving' && !window.ISIE9 &&
                <Button type="primary" onClick={this.handleQuickView}
                        ref="approveQuickView">{messages('request-4.key23')/*快速查看*/}</Button>}
                {status === 'approving' && batchEnabled && allEnabled && (
                  <Checkbox checked={isAll}
                            onChange={(e) => this.handleChangeIsAll(e.target.checked)}>
                    {messages('request-4.key24')/*全选全部单据*/}
                  </Checkbox>
                )}
                <Search
                  className="input-search"
                  maxLength={"100"}
                  placeholder={messages('request-4.key25')/*请输入单号*/}
                  onChange={(e) => this.handleSearch(e.target.value)}
                />
              </Space>
            </div>
          </div>
        </AdvancedTable>
        <If value={status === 'approving'}>
          <div className={`bottom-bar-approve ${animationName}`} style={{marginLeft: 0}}>
            <ApproveBar
              passLoading={passLoading}
              rejectLoading={rejectLoading}
              batchNumber={selectedRows.length}
              allLoading={passLoading || rejectLoading}
              handleApprovePass={value => this.handleApprove(value, 'pass')}
              handleApproveReject={value => this.handleApprove(value, 'reject')}
            />
          </div>
        </If>
        <If value={status === 'approving' && selectedRows.length}>
          <div style={{height: 72}}/>
        </If>
        <Modal
          title={messages('request-4.key26')/*审批中*/}
          visible={visible}
          onCancel={this.handleClose}
          maskClosable={false}
          footer={[
            <Button key="sure" type="primary" onClick={this.handleClose}>{messages('common.ok')/*确定*/}</Button>
          ]}
        >
          <Row type="flex" gutter={16} align="middle" className="approve-all-modal">
            <Col span={8} style={{textAlign: 'right'}}>
              <img src={checkingImg} className="img-inner"/>
              <img src={loadingImg} className="img-out rotation"/>
            </Col>
            <Col span={16}>
              <div>{messages('request-4.key27')/*批量审批中......*/}</div>
              <div>{messages('request-4.key28')/*单据已转入后台处理，您可以离开页面，审批失败的单据会重新显示在待审批列表。*/}</div>
            </Col>
          </Row>
        </Modal>
      </div>
    )
  }

}

ApproveList.contextTypes = {
  router: React.PropTypes.object
};

function mapStateToProps(state) {
  return {
    companyConfiguration: state.login.companyConfiguration,
    profile: state.login.profile,
    newProfile: state.login.options,
    company: state.login.company,
    user: state.login.user,
    authToken: state.main.authToken,
    language: state.main.language
  }
}

export default connect(mapStateToProps)(ApproveList);
